function CreateImageViewer(path){
	var viewer=document.createElement("div")
	
	return viewer
}
function CreateSimpleImageViewer(list,index){
	function CreateControler(){
		var controler=document.createElement("div")
		var next=document.createElement("button")
		var pre=document.createElement("button")
		function checkIndex(){
			if(viewer.index>=list.length-1){
				viewer.index=list.length-1
				next.disabled=true
			}else{
				next.disabled=false
			}
			if(viewer.index<=0||viewer.list.length==0){
				viewer.index=0
				pre.disabled=true
			}else{
				pre.disabled=false
			}
		}
		$(next).click(function(){
			img.src=viewer.list[++viewer.index]
			checkIndex()
		})
		$(pre).click(function(){
			img.src=viewer.list[--viewer.index]
			checkIndex()
		})
		controler.next=function(){$(next).click()}
		controler.pre=function(){$(pre).click()}
		checkIndex()
		$(next).addClass("next")
		$(pre).addClass("pre")
		$(controler).addClass("controler")
		$(controler).append(pre)
		$(controler).append(next)
		
		next.textContent="Next"
		pre.textContent="Previous"
		return controler
	}
	var viewer=document.createElement("div")
	viewer.list=list
	viewer.index=index
	
	var img=document.createElement("img")
	var controler=CreateControler()
	
	img.src=list[index]
	$(viewer).addClass("simple-image-viewer")
	$(viewer).append(img)
	$(viewer).append(controler)
	$(window).keydown(function(event){
	  switch(event.keyCode) {
		case 37:
			controler.pre()
			break
		case 39:
			controler.next()
	  }
	});
	return viewer
}